﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jQuery MiniUI - 专业WebUI控件库</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="keywords" content="jquery,web,grid,表格,datagrid,js,javascript,ajax,web开发,tree,table" />   
    <meta name="description" content="jQuery MiniUI - 专业WebUI控件库。它能缩短开发时间，减少代码量，使开发者更专注于业务和服务端，轻松实现界面开发，带来绝佳的用户体验。" />
    <link href="../core.css" rel="stylesheet" type="text/css" />
    
    <link href="common.css" rel="stylesheet" type="text/css" />
    
</head>
<body>

    <div class="header">
        <div class="headerInner">
            <a class="logo" href="http://www.miniui.com" title="jQuery MiniUI - 专业WebUI控件库">jQuery MiniUI</a>
            <a id="why" href="/why">为什么选择MiniUI？</a>

            <ul class="topmenu">
                <li><a href="/"><span>首页</span></a></li>
                <li onmouseover="showMenu('popup1', this)" onmouseout="hideMenu('popup1', this)"><a href="/product"><span>产品</span></a>
                    <ul id="popup1" class="popupmenu">
                        <li class="product"><a href="/product">产品介绍</a></li>
                        <li><a href="/features">功能特性</a></li>
                        <li><a href="/screenshots">界面截图</a></li>                        
                        <li><a href="/support">支持服务</a></li>
                        <li><a href="/license">授权方式</a></li>
                        
                        <li class="faq"><a href="/faq">常见问题</a></li>
                    </ul>
                </li>
                <li><a href="/demo"><span>示例</span></a></li>
                <li onmouseover="showMenu('popup2', this)" onmouseout="hideMenu('popup2', this)"><a href="/docs"><span>文档</span></a>
                    <ul id="popup2" class="popupmenu">                        
                        <li id="start_link"><a href="/docs/quickstart">快速入门</a></li>
                        <li><a href="/docs/tutorial">开发教程</a></li>
                        <li id="kb_link"><a href="/docs/kb">精华文章</a></li>
                        <li><a href="/docs/api">Api参考手册</a></li>
                    </ul>
                </li>
                <li><a href="/bbs"><span>论坛</span></a></li><li><a href="/download"><span>下载</span></a></li>
                
                <li><a href="/contact"><span>联系</span></a></li>
            </ul>
        
     
        </div>
    </div>
    <div class="topnav">
        <div class="topnavInner">
            <a href="/">首页</a>><a href="/docs">文档中心</a>><span>开发教程</span>
        </div>
    </div>
    <div class="body " >
        <div class="bodyInner">
            
            <div class="bodyCenter" style="padding-bottom:60px;">
                <div style="padding-left:10px;">
                    <table style="width:100%;">
                        <tr>
                            <td style="vertical-align:top;">
                                <h4 id="crud">CRUD</h4>
                                <ul>
                                    <li><a href="crud_celledit.html">CRUD之：单元格编辑</a></li>                                    
                                    <li><a href="crud_rowedit.html">CRUD之：行编辑</a></li>
                                    <li><a href="crud_formedit.html">CRUD之：表单编辑</a></li>
                                    <li><a href="crud_popupedit.html">CRUD之：弹出面板编辑</a></li>
                                </ul>
                            </td>
                            <td style="vertical-align:top;">
                                
                                <h4 id="syslayout">主框架布局</h4>
                                <ul>
                                    <li><a href="layout_outlooktree.html">主框架布局之：OutlookTree</a></li>
                                    <li><a href="layout_outlookmenu.html">主框架布局之：OutlookMenu</a></li>
                                    <li><a href="layout_tree.html">主框架布局之：Tree</a></li>
                                    <li><a href="layout_menu.html">主框架布局之：Menu</a></li>
                                </ul>
                            </td>    
                        </tr>
                        <tr>
                            <td style="width:50%;vertical-align:top;">
                                <h4 id="form">表单控件</h4>
                                <ul>
                                    <li><a href="databinding.html">数据绑定</a></li>
                                    <li><a href="form.html" >表单：加载、保存</a></li>
                                    <li><a href="validator.html"  >表单：数据验证</a></li>
                                    <li><a href="diysize.html">表单：控件尺寸调整</a></li>
                                    <li><a href="selectgrid.html" >弹出：选择表格</a></li>
                                    <li><a href="selecttree.html"  >弹出：选择树</a></li>
                                    <li><a href="button.html">Button：按钮</a></li>
                                    <li><a href="buttonedit.html">ButtonEdit：按钮输入框</a></li>
                                    <li><a href="textbox.html">TextBox：文本输入框</a></li>
                                    <li><a href="combobox.html">ComboBox：下拉选择框</a></li>
                                    <li><a href="combobox2.html">ComboBox：联动选择</a></li>
                                    <li><a href="datepicker.html">DatePicker：日期选择框</a></li>
                                    <li><a href="spinner.html">Spinner：数字输入框</a></li>
                                    <li><a href="treeselect.html">TreeSelect：树形选择框</a></li>
                                    <li><a href="autocomplete.html">AutoComplete：输入智能提示框</a></li>
                                    <li><a href="textboxlist.html">TextBoxList：多选输入智能提示框</a></li>
                                    <li><a href="checkbox.html">CheckBox：复选框</a></li>
                                    <li><a href="listbox.html">ListBox：列表控件</a></li>
                                    <li><a href="checkboxlist.html">CheckBoxList：复选框组</a></li>
                                    <li><a href="radiobuttonlist.html">RadioButtonList：单选框组</a></li>
                                    <li><a href="fileupload.html">FileUpload：文件上传控件</a></li>                                    
                                </ul>
                            </td>
                            <td style="width:50%;vertical-align:top;">
                                <h4 id="datagrid">表格控件</h4>
                                <ul>
                                    <li><a href="datagrid.html"  >分页查询</a></li>
                                    <li><a href="datagrid_columns.html"  >自定义列</a></li>
                                    <li><a href="datagrid_drawcell.html"  >自定义单元格</a></li>
                                    <li><a href="datagrid_columngroup.html">多表头列</a></li>
                                    <li><a href="datagrid_fixedcolumns.html">锁定列</a></li>
                                    <li><a href="datagrid_hidecolumn.html">显示/隐藏列</a></li>
                                    <li><a href="datagrid_filter.html">过滤行</a></li>
                                    <li><a href="datagrid_summary.html">汇总行</a></li>
                                    <li><a href="datagrid_rowdetail.html">详细行</a></li>
                                    <li><a href="crud_celledit.html"  >表格编辑：单元格编辑</a></li>
                                    <li><a href="crud_rowedit.html">表格编辑：行编辑器</a></li>
                                    <li><a href="crud_formedit.html">表格编辑：表单编辑</a></li>
                                    <li><a href="crud_popupedit.html">表格编辑：弹出框编辑</a></li>
                                    <li><a href="cellvalidation.html"  >单元格编辑验证</a></li>
                                    <li><a href="datagrid_contextmenu.html">右键菜单</a></li>
                                    <li><a href="datagrid_grouping.html">分组</a></li>
                                    <li><a href="datagrid_mergecells.html">合并单元格</a></li>
                                    <li><a href="databinding.html">数据绑定</a></li>
                                </ul>
                            </td>    
                        </tr>
                        <tr>
                            <td style="vertical-align:top;">
                                <h4 id="tree">树形控件</h4>
                                <ul>
                                    <li><a href="tree.html">创建树：树形结构</a></li>
                                    <li><a href="tree_list.html" >创建树：列表结构</a></li>
                                    <li><a href="tree_js.html">创建树：本地JSON</a></li>
                                    <li><a href="tree_html.html">创建树：Html生成</a></li>
                                    <li><a href="tree_lazy.html">懒加载树</a></li>
                                    <li><a href="tree_action.html">树操作：增加、删除、修改、移动</a></li>
                                    <li><a href="tree_checkbox.html">多选树：CheckBoxTree</a></li>
                                    <li><a href="tree_dragdrop.html">节点拖拽投放</a></li>
                                    <li><a href="tree_drawnode.html">自定义节点</a></li>
                                    <li><a href="tree_contextmenu.html">右键菜单</a></li>
                                    <li><a href="tree_filter.html">过滤树</a></li>
                                </ul>
                            </td>
                            <td style="vertical-align:top;">
                                <h4 id="treegrid">TreeGrid</h4>
                                <ul>
                                    <li><a href="treegrid.html">创建TreeGrid</a></li>
                                    <li><a href="treegrid_lazyload.html">懒加载</a></li>
                                    <li><a href="treegrid_drawcell.html">自定义单元格</a></li>                                    
                                    <li><a href="treegrid_dragdrop.html">节点拖拽</a></li>                                    
                                </ul>
                            </td>    
                        </tr>
                        <tr>
                            <td style="vertical-align:top;">
                                <h4 id="navigation">导航控件</h4>
                                <ul>                                    
                                    <li><a href="toolbar.html" >ToolBar：工具栏</a></li>
                                    <li><a href="menu.html">菜单</a></li>
                                    <li><a href="menu_html.html">菜单：Html标签</a></li>
                                    <li><a href="contextmenu.html">ContextMenu：右键菜单</a></li>                                    
                                    <li><a href="tabs.html">Tabs：选项卡</a></li>
                                    <li><a href="tabs_load.html">Tabs：懒加载页面</a></li>
                                    <li><a href="outlookbar.html">OutlookBar：折叠面板组</a></li>
                                    <li><a href="outlookmenu.html">OutlookMenu：折叠菜单</a></li>
                                    <li><a href="outlooktree.html">OutlookTree：折叠树</a></li>
                                    <li><a href="pager.html">Pager：分页控件</a></li>
                                </ul>
                            </td>  
                            <td style="vertical-align:top;">
                                <h4 id="layout">布局控件</h4>
                                <ul>                                    
                                    <li><a href="fit.html" >Fit：高度撑满布局器</a></li>
                                    <li><a href="layout.html">Layout：布局管理器</a></li>                                    
                                    <li><a href="splitter.html">Splitter：折叠布局器</a></li>
                                    <li><a href="panel.html">Panel：标题面板</a></li>
                                    <li><a href="panel_load.html">Panel：懒加载</a></li>
                                    <li><a href="window.html">Window：弹出面板</a></li>
                                    <li><a href="formlayout.html">FormLayout：表单布局器</a></li>                                    
                                </ul>
                            </td>  
                        </tr>
                        <tr>

                        </tr>
                    </table>


                </div>
            </div>
            <div class="bodyRight">                              
                <div class="panel">
                    <h1>教程目录</h1>
                    <div class="panelBody">
                        <a href="#syslayout">主框架界面</a>
                        <a href="#crud">CRUD</a>   
                        <a href="#form">表单控件</a>
                        <a href="#datagrid">数据表格</a>
                        <a href="#tree">树形控件</a>
                        <a href="#treegrid">TreeGrid</a>                        
                        <a href="#navigation">导航控件</a>
                        <a href="#layout">布局控件</a>
                    </div>
                </div>
            </div>
            <div style="clear:both;"></div>
        </div>
    </div>
    <div class="footer">
        <div class="footerInner">
            <div id="copyright">Copyright © 上海普加软件有限公司版权所有 </div>
            <div id="bottomlinks"><a href="/sitemap">网站导航</a>|<a href="/support">支持服务</a>|<a href="/license">授权方式</a>|<a href="/contact">联系我们</a></div>
        </div>
    </div>
</body>
</html>
